How to make progress bar while browser is loading page ?

Saint's Knight

make progress bar while browser is loading page.

ang when finish loading , show the page

Jul 17 '06 #1

Subscribe Post Reply

79906

sashi

1,754

Expert 1GB

Hi there,

kindly refer to the below code segment.. hope it works and helps you to get started.. take care and goos luck my fren.. :)

Expand|Select|Wrap|Line Numbers

 
<html>

<script>

var secondWindow = false;

function ProgressBar(sLength) {
 
var BarLength = 400;

var iLength = parseFloat(sLength);

var Bar = parseInt(iLength); 

if(Bar==0)Bar=1;

var Trough = (BarLength - Bar);

if(Trough==0){Trough=1;Bar=99;}
 
if(Bar >99) {Bar=99; Trough=1;}

if(Trough <0) {Trough=1;Bar=99;}
 
var leftVal = (screen.width-490) / 2;

var topVal = (screen.height-20) / 2;

var cellLayer="id1";
 
if(secondWindow == false) { 
 
if (navigator.appName=="Microsoft Internet Explorer"){
 
var theWindow = 
 
'width=490,height=20,left='+leftVal+',top='+topVal+',menubar=no,toolbar=no,location=no,personalbar=no,status=no,scrollbars=no,directories=no,resizable=no';

Window02 = window.open('','wind',theWindow);

Window02.document.open();

Window02.document.write('<html><head><script>window.onunload=function(){window.close();} <\/script><title>RezTrip Administrator Application - Please Wait.....Page is loading.</title></head><body bgColor=#EAF2FF><div id=t1 style="position:absolute; top:10; left:10; background-color:#000000; z-index:2; height:20px;"></DIV><div id=t2 style="position:absolute; top:10; left:10; background-color:#cccccc; z-index:1; height:20px; border:#ff0000 1px solid;"></div></body></html>');
 
Window02.document.close();

}

secondWindow = true;

}

if (secondWindow == true){

if (navigator.appName=="Microsoft Internet Explorer"){
 
if(!Window02.closed){

if(Bar <0 || Trough<0) alert("hello");

Window02.document.getElementById("t1").style.width=(Bar * (BarLength/100)).toString();

Window02.document.getElementById("t2").style.width=BarLength;
 
}
 
}
 
secondWindow = true;

}
 
} 

function demo(){

progressCounter=0;

progressCount=parseFloat(100/250);

for(i=0;i<250;i++){

progressCounter+=progressCount;

ProgressBar(progressCounter);

}

if (navigator.appName=="Microsoft Internet Explorer")

{

if(!Window02.closed)

Window02.close(); 

}

secondWindow = false;

}

</script>

<body>

<input type=button value="show Progress Bar" onClick=demo()>  

</body>

</html>

Jul 17 '06 #2

mbriggs

Hey Great script. I have been looking for one for a while now and i am trying to make it work. I am using this for now.

Expand|Select|Wrap|Line Numbers

 <html>

<head></head>

 <SCRIPT LANGUAGE="JavaScript">
 
<!-- Begin                                PRELOADER *******************************************************

function clearPreloadPage() { //DOM

if (document.getElementById){

document.getElementById('prepage').style.visibility='hidden';

}else{

if (document.layers){ //NS4

document.prepage.visibility = 'hidden';

}

else { //IE4

document.all.prepage.style.visibility = 'hidden';

}

}

}

// End PRELAODER **********************************************-->

</SCRIPT>
 
<!-- onLoad in BODY TAGE FOR PRELOADER -->

  <body topmargin="0" leftmargin="0" onLoad="clearPreloadPage();">
 
<!-----------------------------BANNER IMAGE ------------------------------>

  <IMG SRC="/container/images/pics/header.png" BORDER="0">

<!-----------------------------BANNER IMAGE ------------------------------>
 
<div id="prepage" style="position:absolute; font-family:arial; font-size:30; left:310px; 
 
top:250px;= background-color:white; layer-background-color:white; height:100%; width:100%;">
 
<table>

    <tr>

        <td align="center" id="prepage">
 
            <H2><FONT SIZE="" COLOR="RED">Loading Data..........Please Wait!</FONT></H2>

            <BR>

            <H2><FONT SIZE="" COLOR="RED">It will just be a Moment.</FONT></H2>
 
        </td>
 
</tr>

</table>
 
</div>
 
</body>

</html>

it works pretty good. I just put the onLoad call into the body tag and aafter the page loads my report that takes a moment to load it tells the user to just hang on and it is loading.

I am tyring to make your script work and i see it opens a second window. But i want it to not look like a window but just a progress bar or a little gif or what ever that blinks like its LOADING page. I am sure you 've seen a few in your time.

Anyway, In regards to your script above Do i have to use a second window or do the fancy progress bars you see out there really a second window that doesn't look like it? And if you need to referance the LOAD picture how do you call it ?

Oct 10 '06 #3

Similar topics

Loading page and staring half way down

by: Kerrin | last post by:

I'm trying to go to a new page, but I want it to jump straight to a specific part of the page instead of starting at the top of the page. Anyone got any idea on how this is done? I was trying...

Javascript

How to make a Loading Page

by: 1337.geek | last post by:

I have a webpage, lots of javascript that i pulled from various places, the menu script pre-loads about 50 small images, it only takes about 5 seconds for broadband but for lower band connections i...

HTML / CSS

Redirecting to the Browser Default Page

by: Kenny M. | last post by:

In my Sign Out method I want the user to be redirected to his Browser Default Page, Is It possible??? -- Kenny M.

ASP.NET

how to stop loading page after loading starts

by: dmjpro | last post by:

i want to stop loading page after loading starts ... using js how can i do it thanx in advance

Javascript

Loading page

by: =?Utf-8?B?QWxoYW1icmEgRWlkb3MgS2lxdWVuZXQ=?= | last post by:

Hello misters and miss, I have an application web in asp.net 2.0. I have an Main.aspx page that include javascript code like this: window.location.href = 'anotherpage.aspx'; I want do this:...

ASP.NET

How to display a "loading page, please wait" box...

by: =?Utf-8?B?Z2VvZmZh?= | last post by:

I cannot figure this out and would appreciate any help..... I have a datagrid view that displays the results from a Stored Procedure. it can take awhile to load..... the stored procedure fires...

ASP.NET

Loading Page ... (How?)

by: Ajm113 | last post by:

How can I create that popup bar that displays "Loading Page" on it. That displays on top of the website. Then close out when page is finished loading? Just like the one on Simple Machines Forum's?

Javascript

waiting or loading pages problem

by: vingomail | last post by:

Loading pages should be showed before the next page data are loaded. help me friends. How may i know calculate the next page controls are loaded? Is there any methods to find out this problem? ...

.NET Framework

A javascript based browser home page app

by: goldenv | last post by:

Hi all, I have worked an open source javascript + html page that has the potential to replace your existing browser home page. If you are interested in trying it out, or learning more about it, it...

Javascript

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

Microsoft Access / VBA

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

C# / C Sharp

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET